<template>
  <!-- 增改用户弹框 -->
  <hcDialog
    dialogWidth="30%"
    :dialogTitle="options.type === 'add' ? '新增标准' : '编辑标准'"
    :isVisable="options.show"
    @closeDialog="closeFun"
    @openDialog="openFun"
    top="5%"
  >
    <el-form
      ref="formRef"
      :model="form"
      label-width="6vw"
      status-icon
      :rules="rules"
      :validate-on-rule-change="false"
    >
      <el-form-item prop="deviceCode" label="设备编号">
        <el-select v-model="form.deviceCode">
          <el-option
            v-for="item of deviceArr"
            :key="item"
            :value="item"
            :label="item"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item prop="recipeName" label="配方名称">
        <el-select v-model="form.recipeName">
          <el-option
            v-for="item of recipeArr"
            :key="item.recipeName"
            :value="item.recipeName"
            :label="item.recipeName"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item prop="standardType" label="检测类型">
        <el-select v-model="form.standardType">
          <el-option
            v-for="item of standardType"
            :key="item.value"
            :value="item.value"
            :label="item.label"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item prop="standardName" label="检测项">
        <el-input v-model="form.standardName"></el-input>
      </el-form-item>
      <el-form-item prop="standardValue" label="标准值">
        <el-input v-model="form.standardValue"></el-input>
      </el-form-item>
      <el-form-item prop="standardUpper" label="标准上限值">
        <el-input v-model="form.standardUpper"></el-input>
      </el-form-item>
      <el-form-item prop="standardLower" label="标准下限值">
        <el-input v-model="form.standardLower"></el-input>
      </el-form-item>
      <el-form-item prop="standardUnit" label="单位">
        <el-input v-model="form.standardUnit"></el-input>
      </el-form-item>
      <el-form-item prop="remark" label="备注">
        <el-input v-model="form.remark" type="textarea"></el-input>
      </el-form-item>
      <el-form-item>
        <div class="btns">
          <el-button type="primary" @click="saveDialog()">保存</el-button>
          <el-button @click="closeFun">取消</el-button>
        </div>
      </el-form-item>
    </el-form>
  </hcDialog>
</template>

<script setup name="UserDialog">
import { reactive, ref } from "vue";

import { postStandard, putStandard } from "@/api/check";
import { getGUID } from "@/utils/index";

const emit = defineEmits(["closeDialog"]);

const props = defineProps({
  options: {
    type: Object,
    default: () => {
      return {
        show: false,
        type: "add", // 用于判断是编辑还是删除 add edit
        data: null, // 当前编辑的用户
      };
    },
  },
  standardType: {
    type: Array,
    default: () => [],
  },
  deviceArr: {
    type: Array,
    default: () => [],
  },
  recipeArr: {
    type: Array,
    default: () => [],
  },
});

const formRef = ref();
const form = reactive({
  id: "",
  deviceCode: "",
  recipeNo: "",
  recipeName: "",
  standardName: "",
  standardValue: "",
  standardUpper: "",
  standardLower: "",
  standardUnit: "",
  remark: "",
  standardType: "",
});

const rules = {
  deviceCode: [
    { required: true, message: "请选择设备编号", trigger: "change" },
  ],
  recipeName: [
    { required: true, message: "请选择配方名称", trigger: "change" },
  ],
  standardType: [
    { required: true, message: "请选择检测类型", trigger: "change" },
  ],
  standardName: [{ required: true, message: "请输入检测项", trigger: "blur" }],
  standardValue: [{ required: true, message: "请输入标准值", trigger: "blur" }],
};

function saveDialog() {
  formRef.value.validate(async (valid) => {
    if (valid) {
      let res = "";
      form.recipeNo = props.recipeArr.find(
        (item) => item.recipeName == form.recipeName
      ).recipeNo;

      if (props.options.type === "edit") {
        res = await putStandard(form);
      } else {
        form.id = getGUID();
        res = await postStandard(form);
      }
      if (res) {
        ElMessage.success("保存成功");
        emit("closeDialog", true);
      } else {
        ElMessage.error("保存失败");
      }
    }
  });
}

// 关闭弹框
const closeFun = () => {
  formRef.value?.resetFields();
  emit("closeDialog");
};

function openFun() {
  if (props.options.type === "edit") {
    for (let key in form) {
      form[key] = props.options.data[key];
    }
  }
}
</script>

<style lang="scss" scoped></style>
